<template>
	<view style="padding-bottom: 200rpx;">
		<view class="u-demo-block__content div1">
			<view class="div2">
				<span class="span1">费用类型</span><span class="span2">{{returnData.rechargeExplain}}</span>
			</view>
			<view class="div2">
				<span class="span1">就诊科室</span><span class="span2">{{returnData.department}}</span>
			</view>
			<view class="div2">
				<span class="span1">就 诊 人</span><span class="span2">{{patient.name}}</span>
			</view>
			<view class="div3">
				<span class="span1">就诊卡号</span><span class="span2">{{patient.hospitalNumber}}</span>
			</view>
		</view>
		<view class="u-demo-block__content div1" style="height: 180rpx;">
			<view class="div2">
				<span class="span1">费用明细</span>
			</view>
			<view >
				<span style="float:left">{{returnData.projectName}}</span>
				<span style="float:right" @click="toRecharge()">￥{{returnData.cost.toFixed(2)}}</span>
			</view>
		</view>
		<view class="u-demo-block__content div1" style="height: 180rpx;">
			<view class="div2">
				<span class="span1">支付方式 余额</span>
			</view>
			<view >
				<span style="float:left">卡内余额：￥{{returnData.balance.toFixed(2)}}</span>
				<span style="float:right" @click="toRecharge()">去充值</span>
			</view>
		</view>
		<view class="u-demo-block__content div1" style="height: 290rpx;">
			预约须知：
				
			1.核酸检测结果有效期：7天。
				
			2.受检者必须全程佩戴口罩，采样时将口罩封装在塑料袋里放入口袋中，采样后立即佩戴好口罩。
				
			3、新冠病毒核酸检测（咽拭子）采样前2小时不进食、不吸烟、不饮酒，采样前清水漱口。
				
			4、预约成功后如须退款，请于我院退费窗口办理。
		</view>
		<view class="div5418 u-demo-block__content">
			<view class="div1478">合计:{{returnData.cost.toFixed(2)}}</view>
			<view class="div1438" @click="nucleicAcidAppointmentConfirm()">确认支付</view>
		</view>
	</view>	
	
</template>

<script>
	import {msg} from '@/utils/utils.js'
	import request from '@/utils/requestConfig.js'
	export default{
		data(){
			return{
				userId:uni.getStorageSync('user').id,
				patient:{
					
				},
				returnData:{
					//费用类型
					rechargeExplain:'',
					//费用类型数字
					rechargeExplainId:0,
					//就诊科室id
					departmentId:0,
					//就诊科室
					department:'',
					//就诊人id
					projectName:'',
					//费用明细
					cost:100,
					balance:1,
				}
			}
		},
		created() {
			this.patient=uni.getStorageSync('patient');
			// console.log(this.patient)
			this.nucleicAcidAppointmentConfirmEcho(this.patient.hospitalNumber)
		},
		methods:{
			toRecharge(){
				uni.navigateTo({
					url:'/pages/appointment/BalanceRecharge'
				})
			},
			/* 回显 */
			nucleicAcidAppointmentConfirmEcho(hospitalNumber){
				request.post('/appointment/appointment/nucleic-acid/nucleicAcidAppointmentConfirmEcho',{userId:this.userId,hospitalNumber:hospitalNumber},false).then(res=>{
					console.log(res.data)
					this.returnData=res.data;
					uni.hideLoading();
				}).catch(error=>{
					console.error(error)
				})
			},
			/* 提交 */
			nucleicAcidAppointmentConfirm(){
				let data={
					money:this.returnData.cost,
					patientId:this.patient.id,
					hospitalNumber:this.patient.hospitalNumber,
					campusId:uni.getStorageSync('HospitalId'),
				}
				console.log(data)
				request.post('/appointment/appointment/nucleic-acid/nucleicAcidAppointmentConfirm',data,true).then(res=>{
					console.log(res.data)
					this.returnData=res.data;
					uni.hideLoading()
					uni.navigateTo({
						url:'/pages/appointment/appointmentSuccess'
					})
				}).catch(error=>{
					console.error(error)
				})
			}
		}
	}
</script>

<style scoped>
	.div1{
		
		width:620rpx;
		margin-left:10px;
		margin-top:20px;
		padding: 15rpx 22rpx;
		border:f4f4f5 solid 1rpx;
		border-radius: 6px;
		box-shadow: #bebfc1 1rpx 1rpx 20rpx;
		font-size: 28rpx;
	}
	.div2{
		border-bottom: #E1E1E1 1rpx solid;
		padding: 30rpx 0;
	}
	.div3{

		padding: 30rpx 0;
	}
	.span1{
		color: #C4C6C9;
	}
	.span2{
		margin-left: 13rpx;
		color: #585858;
	}
	.div5418{
		width: 100%;
		height: 100rpx;
		border-top: #B1B2B4 1rpx solid;
		background-color: white;
		position: fixed;
		bottom: 0;
	}
	.div1478{
		width: 300rpx;
		height: 100rpx;
		float: left;
		text-align: center;
		line-height: 100rpx;
	}
	.div1438{
		text-align: center;
		line-height: 100rpx;
		float: right;
		background-color: #3289FF;
		width: 300rpx;
		height: 100rpx;
	}
</style>
